$(function () {

    var memberTable = $("#memberTable").bootstrapTable({
        url: '/member/getAllMember',         //请求后台的URL（*）
        method: 'get',                      //请求方式（*）
        toolbar: '#toolbar',                //工具按钮用哪个容器
        striped: true,                      //是否显示行间隔色
        cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
        pagination: true,                   //是否显示分页（*）
        sortable: true,                     //是否启用排序
        //sortOrder: "asc",                   //排序方式
        //queryParams: 'clothType=70',//传递参数（*）
        //sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
        pageNumber: 1,                       //初始化加载第一页，默认第一页
        pageSize: 10,                       //每页的记录行数（*）
        pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
        search: true,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
        showColumns: true,                  //是否显示所有的列
        showRefresh: true,                  //是否显示刷新按钮
        minimumCountColumns: 2,             //最少允许的列数
        clickToSelect: true,                //是否启用点击选中行
        height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
        uniqueId: "id",                     //每一行的唯一标识，一般为主键列
        cardView: false,                    //是否显示详细视图
        detailView: false,                   //是否显示父子表
        onEditableSave: function (field, row, oldValue, $el) {

            console.log(row);


            var member = row;
            $.ajax({
                type: "post",
                url: "/member/updateMember",
                data: row,
                success: function (data) {

                }

            });
        },
        columns: [
            {
                field: 'id',
                title: 'id',
                visible: false

            },

            {
                field: 'memberName',
                title: '会员名',
                editable: true

            }, {
                field: 'memberMobile',
                title: '手机号',
                editable: true

            }, {
                field: 'childrenName',
                title: '宝贝',
                editable: true
            }, {
                field: 'childrenBirthday',
                title: '生日',
                editable: true

            }, {
                field: 'memberSex',
                title: '姓别',
                editable: true
            }, {
                field: 'memberCash',
                title: '余额',
                editable: true,
                sortable: true

            }, {
                field: 'memberScores',
                title: '积分',
                editable: true,
                sortable: true

            }, {
                field: 'buyCount',
                title: '购买次数',
                sortable: true
            }, {
                field: 'totalBuy',
                title: '购买金额',
                sortable: true
            },
            {
                field: 'operate',
                title: '操作',
                align: 'center',
                // events: operateEvents,
                formatter: function (value, row, index) {
                    return '<input type="button" name="memberDetail" class="btn" data-value="'+row['id']+'" value="查看">'
                }
            }]
    });

    $('body').on('click','input[name=memberDetail]',function (event) {
        var memberId = $(event.currentTarget).attr('data-value');

        $("#memberSaleModal").modal('show');


        $.ajax({
            url:"/member/getMemberSale/"+memberId,
            type:"GET",
            dataType:'json',
            async:false,
            success:function (datas) {
                var saleList = datas['object'];
                var tableHtml ='<ul class="list-view image fluid">';
                for (var sale in saleList){
                    var saleInfo  = saleList[sale];
                    tableHtml+= '<div class="media">\n' +
                        '  <div class="media-left media-middle">\n' +
                        '    <a href="#">\n' +
                        '      <img class="media-object" width="50" height="50" src='+imageUrl+saleInfo.productImag+' alt="...">\n' +
                        '    </a>\n' +
                        '  </div>\n' +
                        '  <div class="media-body">\n' +
                        '    <h4 class="media-heading">'+saleInfo.productId+'  '+saleInfo.salePrice+'</h4>\n' +saleInfo.colorName+' '+saleInfo.sizeName+'  '
                        +saleInfo.createTime+
                        '    \n' +
                        '  </div>\n' +
                        '</div>'
                }
                tableHtml+='</ul>'
                $("#memberSaleMainDiv").html(tableHtml);
            }
        });
        console.log(memberId)
    })


    $("#thisMonthBirth").on('click',function (event) {
        var url  = '/member/getMemberBirth';
        memberTable.bootstrapTable('refresh',{url: url});

    });



})


